import { getToken, setToken, removeToken, setTimeStamp } from "@/utils/auth";
import { login, getUserInfo, getUserDetailById } from "@/api/user";
import { resetRouter } from "@/router";

const state = {
  token: getToken(), // 取出本地存储的 token
  userInfo: {}, // 定义一个 存储 data 的属性 初始值为 {} 而不是 null 因为后面要 开放属性给 getters 如果是null.属性会报错
};

const mutations = {
  // 定义一个 setToken储存 token 方法， 参数 state 为 this.$store  token载荷 为接收到的参数
  setToken(state, token) {
    state.token = token; // 将 state 里面的 token 修改成 本地存储的 token
    setToken(token); // 将得到的 token 存储到 本地
  },
  // 定义一个删除 removeToken删除 token 的方法， 参数 state 为 this.$store
  removeToken(state) {
    state.token = null; // 将 state 内的 token 赋值为 null 空
    removeToken(); // 删除本地储存的 token
  },
  // 定义一个 修改 setUserInfo 的方法 通过 userInfo 接收传来的 data
  setUserInfo(state, userInfo) {
    state.userInfo = userInfo; // 将 state 内的 userInfo 更新
  },
  // 定义一个 reomveUserInfo 删除 userInfo
  reomveUserInfo(state) {
    state.userInfo = {}; // 重新赋值为 {} 而不是 null
  },
};

const actions = {
  // 定义一个 login 获取token 的方法
  async login(context, data) {
    // this.$store.commit()  async await 异步操作  data 传递的参数
    const result = await login(data); //将 data 传递给 login 接口   因为经过 响应拦截器 的处理这里返回的就是数据 data

    context.commit("setToken", result); // 修改 state 内的 token， 将得到的 data 传递给 setUserInfo
  },
  // 定义一个 getUserInfo 获取用户基本资料的异步方法
  async getUserInfo(context) {
    const result = await getUserInfo(); //调用 getUserInfo() 接口获取用户的基本资料 返回值经过 响应拦截器的处理 直接就是 data
    setTimeStamp(); // 获取用户 token 的时候 顺便在本地 存入一个 时间戳
    const baseInfo = await getUserDetailById(result.userId); // 获取用户头像 要在获取用户基本资料之后 所以写在这里
    // 将图片 跟 用户基本资料 合并 { ...result, ...baseInfo } 并存到 userInfo 内
    context.commit("setUserInfo", { ...result, ...baseInfo }); // 将最新的用户资料 存储到 userInfo 中，因为修改 vuex 中的数据只有通过 mutations
    return result; // 这里为什么要返回 为后面埋下伏笔
  },
  // 定义一个登出的方法
  logout(context) {
    // 删除 用户token 以及本地存储的 token
    context.commit("removeToken");
    // 删除 用户资料
    context.commit("reomveUserInfo");
    resetRouter(); // 重置路由
    context.commit("permission/setRoutes", [], { root: true }); // 调用 vuex 子模块的方法 必须要加第三个参数 { root：true }
  },
};

export default {
  namespaced: true,
  state,
  mutations,
  actions,
};
